<section class="main-category has-interest" id="js-intrest-select" >
    <div tabindex="-1" class="overlay"></div>
    <div class="main-category-content">
        <h2>设置学习兴趣</h2>
        <p class="main-category-subtitle">我们帮你挑选内容</p>
        <ul class="main-category-list">
        <!--:for(c in cache.cates){  -->
        <li class="main-category-item active main-category-item--1" data-id="${c.id}">
                <div class="main-category-normal">
                    <h3>${c.name!}</h3>
                </div>
                <div class="main-category-hover hide">
                    <h3>${c.name!}</h3>
                    <ul class="small-category">
                    <!--:for(c1 in c.list){  -->
                        <li data-id="${c1.id}" class="small-category-item ">${c1.name}</li>
                    <!--:}  -->
                    </ul>
                </div>
            </li>
            <!--:}  -->
        </ul>
        <a href="javascript:void(0);" title="保存" class="btn-default main-category-save disabled js-intrest-save">保存</a>
        <a href="javascript:void(0);" title="下次再选" class="btn-outline main-category-cancel js-intrest-cancel" >下次再选</a>
    </div>
</section>
<script>
$(function(){
	$(".js-intrest-cancel").click(function(){
		$("#js-intrest-select").css("display","none")
	})
	var lisave=0;
	$(".small-category-item").click(function(){
		if(lisave<8){
			if(!$(this).hasClass("active")){
				$(this).addClass("active")
				lisave++;
			}
			else{
				lisave--;
				$(this).removeClass("active")
			}
			if(lisave>0){
				$(".js-intrest-save").removeClass("disabled")
			}else{
				$(".js-intrest-save").addClass("disabled")
			}
		}else if(lisave==8){
			if(!$(this).hasClass("active")){
				alert("兴趣最多添加8个!")
			}
			else{
				lisave--;
				$(this).removeClass("active")
			}
			if(lisave>0){
				$(".js-intrest-save").removeClass("disabled")
			}else{
				
			}
			
		}else{
			alert("兴趣最多添加8个!")
		}
		
		
		
	})
	$(".js-intrest-save").click(function(){
		if(lisave>0){
			
			$(".cate-tab-list").find("li").remove();
			$(".cate-tab-list").append('<li class="cate-tab-item active">全部</li>')
			var catearr=[];
			
			$(".small-category-item").each(function(){
				if($(this).hasClass("active")){
					$(".cate-tab-list").append('<li data-id="'+$(this).attr("data-id")+'" class="cate-tab-item ">'+$(this).text()+'</li>')
					var cate={"id":$(this).attr("data-id"),"name":$(this).text()}
					catearr.push(cate)
				}
				
			})
			$.ajax({url:"json/index/$sess",data:{name:"cates",val:JSON.stringify(catearr)},success:function(result){
				new $.zui.Messager('保存成功!', {
				    icon: 'heart',
				    placement: 'center' // 定义显示位置
				}).show();
			    }});
			$("#js-intrest-select").css("display","none")
		}
	})
})
</script>